<template>
  <div>
    <van-nav-bar
      style="background:pink"
      title="订单"
      left-text="返回"
      left-arrow
      @click-left="onClickleft"
    />
    <van-tabs class="dd" style="bottom: 50px">
      <van-tab title="当前订单"></van-tab>
      <van-tab title="历史订单"></van-tab>
    </van-tabs>
    <!-- 商品 -->
    <van-swipe-cell style="bottom: 50px">
      <van-row type="flex" align="center">
        <van-col span="2" offset="1">
          <van-checkbox
            v-model="checked"
            label-disabled
            checked-color="#ee0a24"
          ></van-checkbox>
        </van-col>
        <van-col span="21">
          <van-card
            price="2.00"
            desc="描述信息"
            title="商品标题"
            class="goods-card"
            thumb="https://img01.yzcdn.cn/vant/cat.jpeg"
          >
            <template #num>
              <van-stepper v-model="value" disable-input />
            </template>
          </van-card>
        </van-col>
      </van-row>

      <template #right>
        <van-button @click="delCarPanelHandel(item.sku_id)" square text="删除" type="danger" class="delete-button" />
      </template>
    </van-swipe-cell>

   
  

 

    <!-- 结算 -->
    <van-submit-bar
      :price="3050"
      button-text="提交订单"
      style="margin-bottom: 50px"
      fixed
    >
      <van-checkbox v-model="checked" checked-color="#ee0a24"
        >全选</van-checkbox
      >
      <template #tip>
        你的收货地址不支持同城送,
        <router-link class="link" slot="right" to="/dizhi"
          >修改地址</router-link
        >
      </template>
    </van-submit-bar>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selected: "",
      checked: "",
      value: 1,
    };
  },

 
  //   delCarPanelData (state,id) {
  //     state.carPanelData.forEach((goods,index) => {
  //       if (goods.sku_id === id) {
  //         state.carPanelData.splice(index,1)
  //         return
  //       }
  //     })

  // },
  methods: {
    onClickleft() {
      // 返回上一页
      this.$router.back();
    },
    //  delCarPanelHandel(id){
    //         this.$store.commit('delCarPanelData',id)
    //     }
  },
};
</script>

<style scoped>
.van-tab--active {
  color: black;
  font-weight: bold;
}
.tab-list .van-tabs__line {
  background-color: #a5d403 !important;
}
.dd {
  margin-top: 50px;
}
.goods-card {
  margin: 0;
  background-color: white;
}

.delete-button {
  height: 100%;
}
.nai {
  height: 20px;
  padding: 5px;
  font-size: 20px;
  text-align: center;
  background-color: rgb(35, 75, 114);
  color: rgb(152, 177, 9);
}
</style>
